<template>
  <div>
    <a-modal
      :title="editType === 1 ? '批量修改部门' : '批量修改工种'"
      :visible="visible"
      :confirm-loading="confirmLoading"
      :width="600"
      @ok="handleOk"
      @cancel="handleCancel"
    >
      <a-form-model
        ref="ruleForm"
        :model="formData"
        :rules="rules"
        labelAlign="left"
        :label-col="{ span: 6 }"
        :wrapper-col="{ span: 18 }"
      >
        <a-form-model-item v-if="editType === 1" label="所属部门" prop="depkey">
          <a-tree-select
            v-model="formData.depkey"
            style="width: 100%"
            :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
            :tree-data="departmentList"
            allow-clear
            placeholder="请选择部门"
            tree-node-filter-prop="label"
            :replaceFields="{
              children: 'childs',
              label: 'dep_name',
              value: 'pkey',
            }"
          />
        </a-form-model-item>
        <a-form-model-item v-if="editType === 2" label="工种" prop="work_type">
          <a-select v-model="formData.work_type" placeholder="请选择">
            <a-select-option v-for="(item, index) in workList" :key="index" :value="item.data_value">{{
              item.data_name
            }}</a-select-option>
          </a-select>
        </a-form-model-item>
      </a-form-model>
    </a-modal>
  </div>
</template>
    
<script>
import { getDatadictionary } from '@/api/plan'
import { getDepartmentThreeListApi, editBatchPeopleDepartmentApi,editBatchPeopleWorkApi } from '@/api/people'
export default {
  data() {
    return {
      isEdit: false,
      visible: false,
      confirmLoading: false,
      formData: {
        pkeys: [],
        depkey: '', // 所属部门
        work_type: '', // 工种
      },
      rules: {
        depkey: [{ required: true, message: '请选择所属部门', trigger: 'change' }],
        work_type: [{ required: true, message: '请选择工种', trigger: 'change' }],
      },
      previewVisible: false,
      departmentList: [], // 部门列表
      workList: [], // 工种列表
      editType: 1, // 1部门，2工种
    }
  },
  methods: {
    edit(type, pkeys) {
      this.editType = type
      this.isEdit = true
      this.visible = true
      this.initData()
      this.resetForm()
      this.formData.pkeys = pkeys
    },
    resetForm() {
      this.pkeys = []
      this.formData.depkey = ''
      this.formData.work_type = ''
    },
    initData() {
      this.getWorkList()
      this.getDepartmentThreeList()
    },
    dateChange(date) {
      this.formData.startDate = date[0]
      this.formData.endDate = date[1]
    },
    handleOk() {
      this.$refs.ruleForm.validate(async (valid) => {
        if (valid) {
          this.confirmLoading = true
          let formObj = { ...this.formData }
          let statusCode = null,
          errors = ''
          if (this.editType === 1) {
            delete formObj.work_type
            let res1 = await editBatchPeopleDepartmentApi(formObj)
            statusCode = res1.statusCode
            errors = res1.errors
          }else if(this.editType === 2) {
            delete formObj.depkey
            let res2 = await editBatchPeopleWorkApi(formObj)
            statusCode = res2.statusCode
            errors = res2.errors
          }
          this.confirmLoading = false
          if (statusCode == 200) {
            this.visible = false
            this.$message.success('保存成功！')
            this.$emit('saveSuccess')
            this.resetForm()
            this.$parent.getTableData()
          } else {
            this.$message.error(errors)
          }
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    handleCancel() {
      this.visible = false
      this.$parent.isShowForm = false
    },
    handleImgCancel() {
      this.previewVisible = false
    },
    async handlePreview() {
      this.previewVisible = true
    },
    // 获取部门列表
    async getDepartmentThreeList() {
      const { data } = await getDepartmentThreeListApi()
      this.departmentList = data
    },
    // 获取工种列表
    async getWorkList() {
      const { data } = await getDatadictionary({ data_type: 3 })
      this.workList = data
    },
  },
}
</script>
<style lang="less" scoped>
</style>